﻿<phone:PhoneApplicationPage 
    x:Class="Omnia.Wallet.Views.CardsView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:viewmodel="clr-namespace:Omnia.ViewModels;assembly=Omnia.ViewModels"
    xmlns:converters="clr-namespace:Omnia.Converters;assembly=Omnia.Converters"
    xmlns:UX="clr-namespace:Omnia.UX;assembly=Omnia.UX"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="False">
    <phone:PhoneApplicationPage.Resources>
        <converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
        <converters:ResourceKeyToPathdataConverter x:Key="ResourceKeyToPathdataConverter" />
    </phone:PhoneApplicationPage.Resources>
    <Grid x:Name="LayoutRoot">
        <Grid.DataContext>
            <viewmodel:CardsViewModel/>
        </Grid.DataContext>
        <Grid.Background>
            <ImageBrush ImageSource="{Binding BackgroundImageSource}" Stretch="{Binding GlobalSettings.BackgroundImageStretch}"/>
        </Grid.Background>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <controls:Pivot Title="{StaticResource IDS_PAGE_TITLE}">

            <controls:PivotItem Header="{StaticResource IDS_ITEM_HEADER_CARD_DEBIT}">
                <ListBox ItemsSource="{Binding Path=DebitCardsCollection}" >
                    <ListBox.ItemContainerStyle>
                        <Style TargetType="ListBoxItem">
                            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                        </Style>
                    </ListBox.ItemContainerStyle>
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <toolkit:ExpanderView Margin="0,12">
                                <toolkit:ExpanderView.Header>
                                    <TextBlock Text="{Binding DisplayString}" Style="{StaticResource PhoneTextTitle2Style}" />
                                </toolkit:ExpanderView.Header>
                                <Grid Width="400">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="auto"/>
                                        <ColumnDefinition Width="auto"/>
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                    </Grid.RowDefinitions>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_NUMBER}" Grid.Column="0" Grid.Row="0"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=CardNumber}"  Grid.Column="1" Grid.Row="0"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_MASTER}" Grid.Column="0" Grid.Row="1"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=CardMaster}"  Grid.Column="1" Grid.Row="1"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_BANK}" Grid.Column="0" Grid.Row="2"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=IssuingBank}"  Grid.Column="1" Grid.Row="2"/>
                                </Grid>
                            </toolkit:ExpanderView>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </controls:PivotItem>

            <controls:PivotItem Header="{StaticResource IDS_ITEM_HEADER_CARD_CREDIT}">
                <ListBox ItemsSource="{Binding Path=CreditCardsCollection}">
                    <ListBox.ItemContainerStyle>
                        <Style TargetType="ListBoxItem">
                            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                        </Style>
                    </ListBox.ItemContainerStyle>
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <toolkit:ExpanderView Margin="0,12,0,0" Name="expender">
                                <toolkit:ExpanderView.Header>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="{Binding DisplayString}" Style="{StaticResource PhoneTextTitle2Style}" x:Name="title" />
                                        <Grid Width="{Binding ElementName=title, Path=ActualHeight}" 
                                                  Height="{Binding ElementName=title, Path=ActualHeight}" 
                                                  Visibility="{Binding Path=RecentRepay, Converter={StaticResource BooleanToVisibilityConverter}}">
                                            <Grid Name="backgroundGrid" Visibility="Visible" Margin="6">
                                                <Rectangle Fill="{StaticResource PhoneAccentBrush}" Name="Rect" Visibility="Visible" />
                                            </Grid>
                                            <Path Data="{Binding Source={StaticResource PATH_ICON_BELL}}" Stretch="Uniform" Fill="#FFFFFFFF"  Margin="10" RenderTransformOrigin="0.5,0.5">
                                                <Path.RenderTransform>
                                                    <TransformGroup>
                                                        <TransformGroup.Children>
                                                            <RotateTransform Angle="0" />
                                                            <ScaleTransform ScaleX="1" ScaleY="1" />
                                                        </TransformGroup.Children>
                                                    </TransformGroup>
                                                </Path.RenderTransform>
                                            </Path>
                                        </Grid>
                                    </StackPanel>
                                </toolkit:ExpanderView.Header>
                                <Grid >
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="auto"/>
                                        <ColumnDefinition Width="auto"/>
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                    </Grid.RowDefinitions>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_NUMBER}" Grid.Column="0" Grid.Row="0"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=CardNumber}"  Grid.Column="1" Grid.Row="0"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_MASTER}" Grid.Column="0" Grid.Row="1"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=CardMaster}"  Grid.Column="1" Grid.Row="1"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_BANK}" Grid.Column="0" Grid.Row="2"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=IssuingBank}"  Grid.Column="1" Grid.Row="2"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_CREDITLINE}" Grid.Column="0" Grid.Row="3"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=CreditLine}"  Grid.Column="1" Grid.Row="3"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{StaticResource IDS_LABEL_CARD_NEXTREPAYMENTDATE}" Grid.Column="0" Grid.Row="4"/>
                                    <TextBlock Style="{StaticResource PhoneTextNormalStyle}" Text="{Binding Path=NextRepaymentDate, StringFormat=\{0:M\}}"  Grid.Column="1" Grid.Row="4"/>

                                    <UX:UXPathButtonWithUriAndParameter Width="30" Height="30" Margin="12,0" Grid.Row="5" HorizontalAlignment="Left">
                                        <UX:UXPathButtonWithUriAndParameter.Style>
                                            <Style TargetType="UX:UXPathButtonWithUriAndParameter">
                                                <Setter Property="Template">
                                                    <Setter.Value>
                                                        <ControlTemplate TargetType="UX:UXPathButtonWithUriAndParameter">
                                                            <Grid>
                                                                <Grid Visibility="Visible" >
                                                                    <Path Data="{Binding Source={StaticResource PATH_ICON_CIRCLE}}" Stretch="Fill" Fill="#FFFFFFFF" Visibility="Visible" />
                                                                </Grid>
                                                                <Path Data="{Binding Source={StaticResource PATH_ICON_VIEW}}" Stretch="Uniform" Fill="#FFFFFFFF" Margin="6" RenderTransformOrigin="0.5,0.5">
                                                                    <Path.RenderTransform>
                                                                        <TransformGroup>
                                                                            <TransformGroup.Children>
                                                                                <RotateTransform Angle="0" />
                                                                                <ScaleTransform ScaleX="1" ScaleY="1" />
                                                                            </TransformGroup.Children>
                                                                        </TransformGroup>
                                                                    </Path.RenderTransform>
                                                                </Path>
                                                            </Grid>
                                                        </ControlTemplate>
                                                    </Setter.Value>
                                                </Setter>
                                            </Style>
                                        </UX:UXPathButtonWithUriAndParameter.Style>
                                    </UX:UXPathButtonWithUriAndParameter>
                                </Grid>
                            </toolkit:ExpanderView>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </controls:PivotItem>
            
        </controls:Pivot>

        <UX:UXPathButton Grid.Row="1" 
                         IconPath="{StaticResource PATH_ICON_CLOSE}"
                         Angle="45"
                         Padding="13"
                         HorizontalAlignment="Right" 
                         Margin="24,12" 
                         Uri="/Views/CardAddView.xaml"/>
    </Grid>
    
</phone:PhoneApplicationPage>